<template>
  <el-form :model="ruleForm" class="elForm">
    <!--商业险信息-->
    <el-card class="box-card" shadow="never">

      <div slot="header" class="header-card">
        <span class="header-card-title">商业险信息</span>
      </div>

      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="商业险公司:">
            <span>{{ ruleForm.insuranceVo.syxCompany }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险公司编码:">
            <span>{{ ruleForm.insuranceVo.syxCompanyCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险保单号:">
            <span>{{ ruleForm.insuranceVo.syxPolicyCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险起保日:">
            <span>{{ ruleForm.insuranceVo.syxActualBeginTime }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险到期日:">
            <span>{{ ruleForm.insuranceVo.syxActualEndTime }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险性质:">
            <span>{{
                ruleForm.insuranceVo.syxInsuranceType == 1 ? '运营' : ruleForm.insuranceVo.syxInsuranceType == 2 ? '非运营' : ''
              }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险保费:">
            <span>{{ format_thousand(ruleForm.insuranceVo.syxAmount) }}</span>
          </el-form-item>
        </el-col>


        <el-col :span="24" style="padding-top: 16px">
          <el-form-item label="商业险保单:">
            <image-common v-model="ruleForm.insuranceVo.syxPolicyUrl" :disabled="true" :upType="2"/>
          </el-form-item>
        </el-col>

        <el-col :span="24">
          <div style="padding-bottom:8px;font-size: 16px;">保险套餐</div>
          <el-table :data="ruleForm.insuranceVo.businessList" border size='mini'>
            <el-table-column align="center" prop="insuranceProName" label="商业险种"/>
            <el-table-column align="center" prop="insuranceQuota" label="保额/万元">
              <template slot-scope="{row}">
                <span v-if="typeof row.insuranceQuota === 'number'">
                  {{format_thousand( row.insuranceQuota) || '--' }}
                </span>
                <span>
                  {{row.insuranceQuota}}
                </span>
              </template>
            </el-table-column>
            <el-table-column align="center" label="保险费用/元" prop="insurancePrice">
              <template slot-scope="{row}">
                <span>{{ format_thousand(row.insurancePrice) || '--' }}</span>
              </template>
            </el-table-column>
          </el-table>
        </el-col>


      </el-row>

    </el-card>
  </el-form>
</template>

<script>
import {getInsuranceSelectList} from "@/api/cwgd/insuranceSelect";

export default {
  mame: "commerciaInsurance", // <!--商业险信息-->
  dicts: ["insurance_channels"],

  props: {
    value: {
      type: Object,
      default: {},
    },
  },

  components: {},

  computed: {
    ruleForm: {
      get() {
        let that = this;
        const proxy = new Proxy(that.value, {
          get(target, key) {
            return Reflect.get(target, key);
          },
          set(target, key, value) {
            that.$emit("input", {...target, [key]: value});
            return true;
          },
        });
        return proxy;
      },
    },

  },

  watch: {},
  data() {
    return {
      optionsData: [],
      isShow: true,
    };
  },
};
</script>

<style lang="scss" scoped>
@import "@/styles/cwgd/formScss.scss";
</style>


